<template>
  <div>
    <a-modal
      :visible="visible"
      title="选择学校"
      cancelText="取消"
      okText="确认"
      width="60%"
      @ok="submit"
      @cancel="cancel"
    >
      <div class="mb-20">
        <!-- 查询参数 -->
        <pro-query
          :searchParam="searchParams"
          @on-search ="searchParam"
          @on-reset="onResetParam"
        ></pro-query>
      </div>
      <pro-table
        ref="tableRef"
        :fetch="fetch"
        :columns="columns"
        :operate="operate"
        :param="state.param"
        :pagination="pagination"
      >
      </pro-table>
    </a-modal>
  </div>
</template>

<script>
import {reactive} from "vue";
import { schoolPage } from "@/api/module/course-code-manage";

export default {
  name: "school",
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  setup(props, content) {
    /// 数据来源 [模拟]
    const fetch = async (param) => {
      let response = await schoolPage(param);
      return {
        data: response.data.record||[],
      };
    };

    /// 行操作
    const operate = [
      {
        label: "选择",
        event: function (record) {
          content.emit('submitSchool', record)
        }
      },
    ];

    const state = reactive({
      selectedRowKeys: [],
      param: {},
    })
    const searchParams = [
      { key: "schoolEnName", type: "input", label: "学校名称", placeholder: '请输入学校名称'},
      { key: "code", type: "input", label: "学校编码", placeholder: '请输入学校编码'},
    ]
    const columns = [
      { dataIndex: "code", key: "code", title: "学校编码" },
      { dataIndex: "schoolEnName", key: "schoolEnName", title: "学校名称" },
      { dataIndex: "schFollowUpProgress", key: "schFollowUpProgress", title: "跟进进度" },
    ]

    const cancel = () => {
      content.emit("close", "universityVisible");
    }
    const submit = () => {
      content.emit("close", "universityVisible");
    }

    const searchParam = (value) => {
      console.log('value: ', value);
    }
    const onResetParam = (value) => {
      console.log('value: ', value);
    }

    return {
      columns,
      state,
      operate,
      fetch,
      cancel,
      submit,
      searchParams,
      onResetParam,
      searchParam,
    }
  }
}
</script>

<style scoped>

</style>
